<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title>我的钱包</title>
<link rel="stylesheet" href="${ctx}/static/plug/frozenui-1.3.0/css/frozen.css" media="all">
<link rel="stylesheet" href="${ctx}/static/css/recharge/myMoney.css" media="all">
</head>
<body>

	<header class="ui-header">
		<div style="width: 85%; margin: 5px auto 0px auto;">
			<p class="float-left text-p">我的钱包</p>
			<p class="float-right text-tx" id="txBtn">余额提现</p>
		</div>
	</header>

	<section class="ui-container">
		<div class="ui-flex  ui-flex-ver ui-flex-pack-center content" id="moneyDetailDiv">
			<div style="padding-top: 20px">
				<h2 class="ui-arrowlink" onclick="openTranDetailPage()">
					<span class="ui-panel-subtitle">历史交易明细</span>
				</h2>
			</div>

			<div class="ui-tips ui-tips-warn" style="margin-top: 40px; display: none;" id="nopayMsgDiv">
				<i></i><span><font color="#da5600">账户有未支付的订单</font></span>
				<p style="font-size: 10px;">
					<font color="#da5600">暂时无法享受停车场直通服务和折扣优惠<br /> 建议立即充值或者支付未付订单
					</font>
				</p>
			</div>
		</div>
	</section>
</body>
<script src="${ctx}/static/plug/frozenui-1.3.0/lib/zepto.min.js"></script>
<script src="${ctx}/static/plug/frozenui-1.3.0/js/frozen.js"></script>
<script src="${ctx}/static/js/jweixin-1.2.0.js"></script>
<script>
    wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: "${signature.appId}", // 必填，公众号的唯一标识
        timestamp: "${signature.timestamp}", // 必填，生成签名的时间戳
        nonceStr: "${signature.nonceStr}", // 必填，生成签名的随机串
        signature: "${signature.signature}",// 必填，签名，见附录1
        jsApiList: [ 'chooseWXPay']
        // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
    });

	var paramObj = {
		"myMoneyDetailParams" : "${myMoneyDetailParams}",
		"withdrawCashParams" : "${withdrawCashParams}",
		"unpayDetailParams" : "${unpayDetailParams}",
		"topupParams" : "${topupParams}",
		"transDetailParams" : "${transDetailParams}"
	};
	
	$(function() {
		$.post("${action}", {
			"params" : paramObj.myMoneyDetailParams
		}, function(resp) {
			if (resp.result) {
				var moneyData = resp.data;
				if (moneyData) {
					var haveNopay = false;
					var unpayDetail = moneyData.unpayDetail;
					if (unpayDetail) {
						if (unpayDetail.arrearsParkInfoList && unpayDetail.arrearsParkInfoList.length > 0) {
							haveNopay = true;
						}
						if (unpayDetail.unPayParkInfoList && unpayDetail.unPayParkInfoList.length > 0) {
							haveNopay = true;
						}
					}

					if (haveNopay) {
						$("#moneyDetailDiv").prepend(genNoPayDetai(unpayDetail));
						$("#nopayMsgDiv").show();
					}

					var userInfo = moneyData.userInfo;
					$("#moneyDetailDiv").prepend(genBalanceHtml(userInfo.coupon / 10, 2));
					$("#moneyDetailDiv").prepend(genBalanceHtml(userInfo.money / 10, 1));

					$("#txBtn").attr("data", userInfo.money);

					$("#txBtn").click(function() {
						var userBalance = $(this).attr("data");
						if (userBalance <= 0) {
							showTips("warn", "余额不足，无法提现！");
						} else {
							openWithdrawCashPage();
						}
					});
				} else {
					showTips("warn", resp.msg);
				}
			} else {
				showTips("warn", resp.msg);
			}
		});
	});

	function openWithdrawCashPage() {
		var url = "${action}?params=" + paramObj.withdrawCashParams;
		window.location.href = url;
	}

	function genBalanceHtml(balance, type) {
		var desc1 = "", btnDesc = "", desc2 = "";
		if (type == 1) {
			desc1 = "余额";
			btnDesc = "充值";
			desc2 = "现在充值可享全城8折优惠";
		} else if (type == 2) {
			desc1 = "赠券";
			btnDesc = "获取赠券";
			desc2 = "每消费￥10可使用2元赠券";
		}
		var htmlStr = "";
		htmlStr += "<div class='div-content'>";
		htmlStr += "<ul class='ui-grid-halve'>";
		htmlStr += "<li style='margin-right: 0px; padding-right: 20px;'>";
		htmlStr += "<div class='ui-grid-halve-img' style='padding-top: 0px; padding-bottom: 0px; padding-left: 10px; width: 100%'>";
		htmlStr += "<h1>" + desc1 + "</h1>";
		htmlStr += "<h2 style='font-size: 200%;'>￥" + balance.toFloat(2) + "</h2></div></li>";
		htmlStr += "<li style='margin-right: 0px; padding-right: 20px;'>";
		htmlStr += "<div class='ui-grid-halve-img ui-btn-wrap' style='margin-right: 20px; padding-right: 50px;'>";
		htmlStr += "<button type='button' class='ui-btn-lg ui-btn-primary charge_button' onclick='openTopup()'>"
				+ btnDesc + "</button>";
		htmlStr += "<p style='font-size: 12px; padding-top: 5px;'>" + desc2 + "</p></div></li></ul></div>";
		return htmlStr;
	}

	function genNoPayDetai(unpayDetail) {
		var unPayMoney = 0;
		if (unpayDetail.arrearsParkInfoList && unpayDetail.arrearsParkInfoList.length > 0) {
			for ( var i = 0; i < unpayDetail.arrearsParkInfoList.length; i++) {
				var arrearsParkInfo = unpayDetail.arrearsParkInfoList[i];
				unPayMoney += (arrearsParkInfo.afterMoney * -1);
			}
		}

		if (unpayDetail.unPayParkInfoList && unpayDetail.unPayParkInfoList.length > 0) {
			for ( var i = 0; i < unpayDetail.unPayParkInfoList.length; i++) {
				var unPayParkInfo = unpayDetail.unPayParkInfoList[i];
				unPayMoney += unPayParkInfo.charge;
			}
		}

		var htmlStr = "<div class='div-content ' style='background-color: #d32d26;'>";
		htmlStr += "<ul class='ui-grid-halve'>";
		htmlStr += "<li style='margin-right: 0px; padding-right: 20px;'>";
		htmlStr += "<div class='ui-grid-halve-img' style='padding-top: 0px; padding-bottom: 0px; padding-left: 10px; width: 100%'>";
		htmlStr += "<h1>未付订单</h1>";
		htmlStr += "<h1>￥" + (unPayMoney / 10).toFloat(2) + "</h1>";
		htmlStr += "</div></li>";
		htmlStr += "<li style='margin-right: 0px; padding-right: 20px;'>";
		htmlStr += "<div class='ui-grid-halve-img ui-btn-wrap' style='margin-right: 20px; padding-right: 50px;'>";
		htmlStr += "<button type='button' class='ui-btn-lg ui-btn-danger charge_button' onclick='openHfdPage()'>支付</button>";
		htmlStr += "</div></li></ul>";

		if (unpayDetail.arrearsParkInfoList && unpayDetail.arrearsParkInfoList.length > 0) {
			for ( var i = 0; i < unpayDetail.arrearsParkInfoList.length; i++) {
				var arrearsParkInfo = unpayDetail.arrearsParkInfoList[i];
				htmlStr += genUnpayDiv(arrearsParkInfo);
			}
		}
		if (unpayDetail.unPayParkInfoList && unpayDetail.unPayParkInfoList.length > 0) {
			for ( var i = 0; i < unpayDetail.unPayParkInfoList.length; i++) {
				var unPayParkInfo = unpayDetail.unPayParkInfoList[i];
				htmlStr += genUnpayDiv(unPayParkInfo);
			}
		}
		htmlStr += "</div>";
		return htmlStr;
	}

	function genUnpayDiv(unPayDetail) {
		var noPayMoney = 0;
		if (unPayDetail.chargeType == 0) {
			noPayMoney = unPayDetail.charge / 10;
		} else {
			noPayMoney = (unPayDetail.afterMoney * -1) / 10;
		}
		var htmlStr = "";
		htmlStr += "<ul class='ui-grid-flex' style='margin-left: 0px;'>";
		htmlStr += "<li style='padding-bottom: 10px; padding-left: 10px'>";
		htmlStr += "<p class='ui-nowrap ui-whitespace' style='padding-top: 10px; font-size: 12px;'>";
		htmlStr += "商户名称：&nbsp;<span>" + unPayDetail.parkLotName
				+ "</span> <span style='padding-right: 20px;float: right;'>-￥" + noPayMoney.toFloat(2) + "</span></p>";
		htmlStr += "<p class='ui-nowrap ui-whitespace' style='padding-top: 5px; font-size: 12px;'>";
		htmlStr += "消费时间：&nbsp;<span>" + unPayDetail.outTime.toDateString() + "</span></p></li></ul>";
		return htmlStr;
	}

	//支付未付订单
    var canSubmit = true;
	function openHfdPage() {
        var paraObj = {
            "appId": "${signature.appId}",
            "params": paramObj.unpayDetailParams
        };
        if (canSubmit) {
            canSubmit = false;
            $.post("${action}", paraObj, function (obj) {
                console.log(obj);
                canSubmit = true;
                if (obj.result) {
                    var wxPayParams = JSON.parse(obj.data);
                    console.log(wxPayParams);
                    wx.chooseWXPay({
                        timestamp: wxPayParams.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
                        nonceStr: wxPayParams.nonceStr, // 支付签名随机串，不长于 32 位
                        package: wxPayParams.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
                        signType: wxPayParams.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
                        paySign: wxPayParams.paySign, // 支付签名
                        success: function (res) {
                            console.log("pay success");
                            console.log(res);

                        }
                    });
                } else {
                    showTips("warn", obj.msg);
                    //location.reload(true);
                }
            });
        }

	}

	function openTopup() {
		var url = "${action}?params=" + paramObj.topupParams;
		window.location.href = url;
	}

	function openTranDetailPage() {
		var url = "${action}?params=" + paramObj.transDetailParams;
		window.location.href = url;
	}
</script>
</html>
